Im having trouble with this Reactjs component. I have imported and installed the component, type in necessary code. But it appeared with a black slider Here is the code I imported:
import React from "react";
import "./Banner.css";
import SimpleImageSlider from "react-simple-image-slider";
const image = [
{ url: "./banner1.png" },
{ url: "./banner2.png" },
];
const Banner = () => {
return (
<>
<SimpleImageSlider
width={1920}
height={1080}
images={image}
style={Banner.css}
slideDuration={1}
navStyle={1}
showBullets
Shownavs
/>
</>
)
}
export default Banner
***Import like this it will work***
import image1 from './image1.jpg';
import image2 from './image2.jpg';
import image3 from './image3.jpg'
const image = [
{ url: image1 },
{ url: image2 },
{ url: image3 }
];